<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:wh="http://java.sun.com/jsf/composite/wh"
	xmlns:p="http://primefaces.org/ui">
<h:body>
	<ui:composition template="template/template.xhtml">
		<ui:define name="content">
				<h:form id="chart1" styleClass="horizontal_full">
					
					<h1><h:outputText value="Statistische Auswertungen"/></h1>
					
					<p:chart type="line" model="#{chartMBean.statistic}" style="height:500px;" />
				
					
					<h:panelGrid columns="3" style="margin-bottom: 10px">
						<h3>Mean</h3>
						<p:inputText id="txt3" value="#{chartMBean.mean}" />
	        			<p:slider for="txt3" step="10" style="width: 100px" immediate="true" onSlideEnd="document.getElementById('chart1:repaintButton').click()"/>
        			</h:panelGrid>
        			
        			
        			<h:panelGrid columns="3" style="margin-bottom: 10px">
        				<h3>Variance</h3>
						<p:inputText id="txt4" value="#{chartMBean.variance}" />
	        			<p:slider for="txt4" step="10" style="width: 100px" immediate="true" onSlideEnd="document.getElementById('chart1:repaintButton').click()" />
        			</h:panelGrid>
        			
        			<p:commandButton style="display: none;" value="Show Distribution" id="repaintButton" update="chart" actionListener="#{chartMBean.sliderAction}"/>
	 
	        		<p:graphicImage id="chart" value="#{chartMBean.chart}" cache="false"/>
				</h:form>
		</ui:define>
	</ui:composition>
</h:body>
</html>